<#include "/common/head.html"/>
<!-- <script src="/res/js/jquery-easyui/jquery.min.js"></script> -->
<script type="text/javascript"> 
var xset = [];//X轴数据集    
//var yset_1 = [];//Y轴数据集 1
var yset_2 = [];//Y轴数据集 2
//var yset_3 = [];//Y轴数据集 2
  $(document).ready(function() {  
    $.ajax({
			type : 'get',
			url : '/wms/report/outStorage_monthReport',//请求数据的地址
			success : function(data) {						
				$.each(data, function(i, item) {					
					xset.push(item.gdate);
					//yset_1.push(item.num/5000);	
					yset_2.push(item.gcount);	
					//yset_3.push(item.kr_perc*100);
				});
			}
    });
   
     setTimeout(drawchart,500);
    //setInterval(drawchart, 10000);
  });
  
function drawchart(){ 	
	//highchart绘图
    Highcharts.chart('canvas', {
       
    	chart: {
    		zoomType: 'xy'
        },
        title: {
            text: '月出库情况'
        },        
        xAxis: {
            categories:xset,
            crosshair: true
        },
        yAxis: [{ // Primary yAxis
        	title: {
                text: '数量',
                style: {
                    color: Highcharts.getOptions().colors[1]
                }
            },labels: {
                format: '{value}次',
                style: {
                    color: Highcharts.getOptions().colors[1]
                },opposite: true
        		}
            }], 
        tooltip: {
                shared: true
            },
        series: [{
            name: '月出库次数',
            type: 'column',
            data: yset_2
        }],
        credits: {
            enabled: false
        } 
    }); 
}
function getParam() {
	/* var param = {
		"date_time" : $("#years").val() + $("#months").val(),
	} */
	var param={"date_time":''};
	$("#tb :input[name]").each(function(i, item) {
		if ($(item).val()) {
			param["date_time"] += $(item).val();
		}
	});		
	for (key in param) {
		if (!param[key]) {
			delete param[key];
		}
	}
	return param;
}
function ChangeDate() {	
	xset = [];//X轴数据集    
	//var yset_1 = [];//Y轴数据集 1
	yset_2 = [];
	$.get("/wms/report/outStorage_monthReport", getParam(), function(data) {
		$.each(data, function(i, item) {					
			xset.push(item.gdate);
			//yset_1.push(item.num/5000);	
			yset_2.push(item.gcount);	
			//yset_3.push(item.kr_perc*100);
		});
	});
	 setTimeout(drawchart,500);
}
</script>
<script src="/res/js/highcharts5.05/highcharts.js"></script>
<script src="/res/js/highcharts5.05/modules/exporting.js"></script>
<div id="subLayout" class="easyui-layout"
	data-options="fit:true, border:false">
	<div data-options="region:'center', border:false">
		<div id="tb" style="padding: 2px 5px;">
			<div class="wrap_search">
				<span class="search_item"> <span class="item_text">年份:
				</span> <span class="item_obj"> <input class="easyui-combobox"
						name="years" id="years" value="" style="width: 100px"
						data-options="
			            				valueField: 'id',
        								textField: 'text',
			            				data: [
			            					{id:'', text:'-请选择-'}<#list dictYears.keySet() as key>,{id:'${key}', text:'${dictYears.get(key)}'}</#list>
			            				]
			            			" />
				</span>
				</span> <span class="search_item"> <span class="item_text">月份:
				</span> <span class="item_obj"> <input class="easyui-combobox"
						name="months" id="months" value="" style="width: 100px"
						data-options="
			            				valueField: 'id',
        								textField: 'text',
			            				data: [
			            					{id:'', text:'-请选择-'}<#list dictMonths.keySet() as key>,{id:'${key}', text:'${dictMonths.get(key)}'}</#list>
			            				]
			            			" />
				</span>
				</span>
			</div>

			<div id="searchBtnWrap" style="float: right; padding-right: 200px;">
				<input type="button" onclick="ChangeDate()" value="确认" />
			</div>
			<div id="canvas" style="width: 100%; height: 50%;"></div>
		</div>
	</div>
<#include "/common/foot.html"/>